<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>忘记密码</title>
		<link rel="stylesheet" href="css/fp.css" />
		<script>
			window.onload=function(){
				function change(){
				var oFs=document.documentElement.clientWidth/(320/20);
//				console.log(document.documentElement.clientWidth)
				document.documentElement.style.fontSize=oFs+"px";
				}
				change();
				
				window.onresize=function(){
					change();
				}
				var inp=document.getElementsByClassName("f-inp")[0];
				var btn=document.getElementsByClassName("btn")[0];
				var tc=document.getElementsByClassName("f-tc")[0];
				var qd=document.getElementById("qd");
				var pp=document.getElementById("pp");
				inp.onblur=function(){
					if(inp.value.length>11){
						alert("手机位数不能超过11位！");
//						console.log(2222);
				}
				}
				
				btn.onclick=function(){
					if(inp.value.length>11 || inp.value.length<11){
						alert("手机位数不能不等于11位！");
						console.log("手机位数不能不等于11位")
						tc.style.display="none";
					}else if(inp.value.length==11){
						console.log("正确！")
						tc.style.display="block";
						pp.innerHTML=inp.value;
					}
				}
				
				
				qx.onclick=function(){
					tc.style.display="none";
				}
				qd.onclick=function(){
					tc.style.display="none";
				}
			}
		</script>
	</head>
	<body>
		<div class="f-header">
			<img src="img/icon_03.png" alt="" class="f-img"/>
			<span>忘记密码</span>
		</div>
		<p class="f-p">请输入您绑定的手机号码</p>
		<div class="f-body">
			<input type="text" placeholder="手机号码" class="f-inp"/>
			<img src="img/icon_06.png" alt="" class="f-img" id="f-img1"/>
			<img src="img/icon_09.png" alt="" class="f-img2"/>
		</div>
		<input type="button" class="btn" value="下一步"/>
		<div class="f-tc">
			<div class="f-div">
				<p class="f-qr">确认手机密码</p>
				<div class="f-fs">我们将发送验证码到：<br /><p id="pp"></p></div>
				<div class="f-div1"><button id="qx">取消</button><button id="qd"><a href="yanZhengMa.html">确定</a></button></div>
			</div>
		</div>
	</body>
</html>
